import React, { Component } from 'react'
import './index.css'
export default class user extends Component {
    constructor (props) {
        super(props)
        this.state = {
            list:[
                {
                    id:1,
                    name:['地址管理','我的优惠卷','优先购买权']
                },
                {
                    id:2,
                    name:['以旧换新','常见问题','服务支持']
                },
                {
                    id:3,
                    name:['意外碎屏保修服务','延长保修服务']
                },
            ]
        }
    }
    render() {
        return (
            <div id="person">
            <div className="header">
               <h1 className="nav-title">个人中心</h1>
            </div>
            <div className="wrapper">
                <div  className="common-box box-userinfo">
                     <div className="avatar"> 
                         <img  src="//static.smartisanos.cn/account/asset/img/default-user-avatar.png"/> 
                    </div> 登录/注册 
                </div>
                <ul className="common-box menu-list-parallel box-order"> 
                    <li> 
                        <a  className="icons icon-order" target="_self" >全部订单</a> 
                    </li> 
                    <li> 
                        <a className="icons icon-unpay" target="_self" >待付款</a> 
                    </li>
                    <li> 
                        <a className="icons icon-undone" target="_self" >待收货</a>
                    </li>
                    <li> 
                        <a className="icons icon-aftersale" target="_self" >售后</a> 
                    </li> 
                </ul>
                {
                    this.state.list.map((item)=>{
                        return <ul className="common-box menu-list-vertical" key={item.id}>
                            {item.name.map((subitem)=>{
                               return <li className="arrow-right-icon" v-for="subitem in item.name" key={subitem}>
                                <a target="_self">{subitem}</a> 
                                </li>
                            })}
                        </ul>
                    })
                }
                
            </div>
        </div>
        )
    }
}
